<template>
  <el-dialog title="任务完成审批" :center="true" :visible.sync="visible" :close-on-click-modal="false">
    <el-descriptions :column="2" border :size="size" label-class-name="label-style">
      <el-descriptions-item label="任务名称" :span="2">{{ latestTaskCompleteApplyVO?.title }}
      </el-descriptions-item>
      <el-descriptions-item label="申请人" content-class-name="content-style1">{{
          latestTaskCompleteApplyVO?.applicant
        }}
      </el-descriptions-item>
      <el-descriptions-item label="提交时间" content-class-name="content-style1">{{
          latestTaskCompleteApplyVO?.createTime
        }}
      </el-descriptions-item>
      <el-descriptions-item label="完成情况" :span="2">{{ latestTaskCompleteApplyVO?.description }}
      </el-descriptions-item>
      <el-descriptions-item label="附件" :span="2">
        <el-tag v-for="attachment in latestTaskCompleteApplyVO?.taskAttachments" size="mini"
                :key="attachment.filePath">
          <el-link :href="attachment.filePath" target="_blank">{{
              extractFileName(attachment.filePath)
            }}
          </el-link>
        </el-tag>
      </el-descriptions-item>
<!--      <el-descriptions-item label="审批意见" content-class-name="content-style1" :span="3">
        <el-input type="textarea"
                  placeholder="评论全文，可@相关人员" v-model="completeApprovalOpinion"
                  maxlength="256"
                  show-word-limit size="mini">
        </el-input>
      </el-descriptions-item>-->
      <el-descriptions-item>
        <el-button type="text">退 回</el-button>
        <el-button type="text" @click="approvedComplete">同意</el-button>
      </el-descriptions-item>
    </el-descriptions>
  </el-dialog>
</template>

<script>
export default {
  name: "GMApprovalPartyTask",
  data(){
    return{
      size:"mini",
      latestTaskCompleteApplyVO: null,
      completeApprovalOpinion:'',
      taskId:''
    }
  },
  computed: {
    visible: {
      get() {
        return this.$store.state.isVisible;
      },
      set(value) {
        this.$store.commit('setIsVisible', value);
      }
    },
  },
  methods:{
    approvedComplete(){
      this.$http.post(`task/complete_apply/approval/${this.taskId}`).then( response => {
        if (response.data.code == 1){
          this.$message.success("审批完成")
        }else {
          this.$message.error("审批失败")
        }
      })
    },
    extractFileName(path) {
      return path.substring(path.lastIndexOf('/') + 1);
    }
  },
  mounted() {
    this.taskId = this.$store.state.taskId
    this.$http.get(`task/complete/party/${this.taskId}`).then( response => {
      if (response.data.code == 1){
        this.latestTaskCompleteApplyVO = response.data.data
        console.log(this.latestTaskCompleteApplyVO)
      }else {
        this.$message.error("获取完成申请数据失败")
      }
    })
  }
}
</script>

<style scoped>
::v-deep .label-style {
  width: 8%;
  color: #909399;
  font-size: 0.8125rem;
  font-weight: bold;
}
::v-deep .content-style1 {
  width: 20%;
  font-size: 0.75rem;
  word-break: break-all
}
</style>